<template>
  <div class="content">
    <div class="header">
      <img :src="$serveUrl + user.icon" alt="" />
      <div class="user-box">
        <a href="javascript:;">{{ user.nikename }}</a>
      </div>
      <a href="javascript:;" @click="logout" class="exit">退出登陆</a>
    </div>
  </div>
</template>

<script>
export default {
  name: "user",
  props: {},
  data() {
    return {
      user: {},
    };
  },
  components: {},
  mounted() {
    this.$axios.get("/public/autoLogin").then((res) => {
      this.user = res.data;
    });
  },
  updated() {},
  methods: {
    logout() {
      window.localStorage.removeItem("user");
      this.$router.push("/login");
    },
  },
  computed: {},
};
</script>

<style scoped>
.header img{
  width: 100%;
  height: 6rem;
  border-radius: 50%;
  overflow: hidden;
}
.user-box{
  text-align: center;
}
.exit{
  margin: 1rem;
  float: right;
}
</style>